<template>
    <div class="mytabs">
        <el-tabs v-model="activeIndex" @tab-click="handleClick">
            <el-tab-pane label="数据" name="1"><data-list></data-list></el-tab-pane>
            <el-tab-pane label="功能" name="2"><fun-list></fun-list></el-tab-pane>
            <el-tab-pane label="工具" name="3"><tool-list></tool-list></el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
import DataList from './DataList.vue'
import FunList from './FunList.vue'
import ToolList from './ToolList.vue'

export default {
    components: {
        DataList,
        FunList,
        ToolList,
    },
    methods: {
        handleClick(tab,event){
            
        }
    },
    computed: {
        activeIndex:{
            get () {
                return this.$store.state.basic.menuIndex
            },
            set (newValue){
                this.$store.commit('setMenuIndex', newValue);
            }
        }
    },
    created () {
       
    },
    mounted () {

    }
}
</script>

<style lang="less">
    .mytabs {
        position: absolute;
        height: 100%;
        width: 300px;
        left: 68px;
        top: 0;
        background-color: #fff;
        .el-tabs__header{
            display: none;
        }
    }
</style>
